<app-toolbar>
  <nz-space>
    <button nz-button *nzSpaceItem nzType="default" (click)="clear()">清空</button>
    <button nz-button *nzSpaceItem nzType="primary" (click)="add()">添加</button>
  </nz-space>
</app-toolbar>


<nz-table [nzData]="formArray.controls" [nzFrontPagination]="false" nzSize="small" [formGroup]="formGroup">
  <thead>
  <tr>
    <th>数据点</th>
    <th>值</th>
    <th>延迟</th>
    <th>表达式</th>
    <th>操作</th>
  </tr>
  </thead>
  <tbody formGroupName="items" cdkDropList (cdkDropListDropped)="drop($event)" >
  <tr *ngFor="let data of formArray.controls; let i=index" [formGroupName]="i" cdkDrag>
    <td>
      <input nz-input formControlName="point" nzSize="small" (change)="change()" required/>
    </td>
    <td>
      <nz-input-number formControlName="value" (change)="change()" required></nz-input-number>
    </td>
    <td>
      <nz-input-number formControlName="delay" [nzMin]="0" [nzMax]="10" [nzStep]="1" nzSize="small" (change)="change()" required></nz-input-number>
    </td>
    <td>
      <input nz-input formControlName="expression" nzSize="small" (change)="change()" required/>
    </td>
    <td>
      <a cdkDragHandle title="移动">
        <i nz-icon nzType="drag" nzTheme="outline"></i>
      </a>
      <nz-divider nzType="vertical"></nz-divider>
      <a cdkDragHandle title="复制" (click)="copy(i)">
        <i nz-icon nzType="copy" nzTheme="outline"></i>
      </a>
      <nz-divider nzType="vertical"></nz-divider>
      <a nz-popconfirm nzPopconfirmTitle="确定删除?" (nzOnConfirm)="remove(i)" title="删除">
        <i nz-icon nzType="delete" nzTheme="outline"></i>
      </a>
    </td>
  </tr>
  </tbody>
</nz-table>
